import React, { Component } from 'react';
import {
    WhiteSpace,
    Flex,
    List,
    Button,
    Icon,
    Grid,
    Modal,
    Switch,
    NoticeBar,
    ActionSheet, WingBlank, Toast
} from 'antd-mobile';
import { connect } from 'dva';
import { routerRedux } from 'dva/router';
import MyScroll from '../../components/MyScroll/MyScroll';
import CanChangeScrollX from "../../components/CanChangeScrollX/CanChangeScrollX"
import NoLazyImg from '../../components/NoLazyImg/NoLazyImg';
import NavTopBar from '../../components/NavTopBar/NavTopBar';
const Item = List.Item;
import { createForm } from 'rc-form';

import orderAddress from '../../assets/svg/orderAddress.svg'
import notice from '../../assets/svg/notice.svg'
import cricleSvg from '../../assets/img/cricle.svg'

import { order_all, submit_btn, merch_bill ,footBar, model_button,fapiao, span_address, my_swith, item, item_select, activityC, actioveClass } from "./order.less";
import {gift_list} from "../cart/cartGoods.less";

let wrapProps;


class order extends Component {
    constructor(props) {
        super(props);
        this.state = {
            clicked: 'none',
            paytypeModel:false,
            paytype:1,
            coutype:0,
            isPd:1,
            visible:true,
            sendtype:1,
            sendModel:false,
            conModel:false,
            coutype:1,

            // Lz
            showType: 0,

            change: false,
            showData: [],
            curStoreId: '',
        };
        // 要展示的数据
        this.currentId = "";

        // 店铺优惠
        this.storeActivity = {};
        // 优惠券1
        this.couponActivity = {};
        // 优惠券2
        this.couponSubmit = {};
        // 支付方式
        this.paymentType = {};
        this.paytype='';
        // 配送方式
        this.expressType = {};
        // 发票信息
        this.invoices = {};
        // 买家留言
        this.messages = {};


        // 店铺优惠
        this.storeActivityText = "";
        // 优惠券
        this.couponActivityText = "";
        // 配送方式
        this.expressTypeText = "";
    }

    componentWillUnmount() {
        this.currentId = "";
        this.storeActivity = {};
        this.couponActivity = {};
        this.paymentType = {};
        this.paytype='';
        this.expressType = {};
        this.invoices = {};
        this.messages = {};
        // 店铺优惠
        this.storeActivityText = "";
        // 优惠券
        this.couponActivityText = "";
        // 配送方式
        this.expressTypeText = "";
    }

    componentDidMount() {
        this.props.dispatch({ type:'order/getcouEFF' });

        // this.props.dispatch({ type:'order/settlementEFF' }).then((list)=>{
        //     let map = new BMap.Map("allmap");
        //     let point = new BMap.Point(116.331398,39.897445);
        //     map.centerAndZoom(point,12);
        //     let than = this;
        //     //
        //     let geolocation = new BMap.Geolocation();
        //     geolocation.getCurrentPosition(function(r){
        //         if(this.getStatus() == BMAP_STATUS_SUCCESS){
        //             let mk = new BMap.Marker(r.point);
        //             map.addOverlay(mk);
        //             map.panTo(r.point);
        //
        //             let storeIds =  list.reduce((p,v,i,a)=>{
        //                 return p+v.storeId+","
        //             },"")
        //
        //             than.props.dispatch({ type:'order/addrAndSelfEFF', obj:{ storeId:storeIds, ssAtitude:r.point.lat, ssLongitude:r.point.lng } })
        //            // alert('您的位置：'+r.point.lng+','+r.point.lat);
        //         } else {
        //             console.log('failed'+this.getStatus());
        //         }
        //     });
        //
        //
        // });
    }

    init = (data) => {
        data.forEach(e => {
            var a = e.shopActivityPromotionRuleList.filter(e => e.isDefault)[0] || "";
            this.storeActivity[e.storeId] = a && a.activityId;
            var b = e.couponActivityRuleList.filter(e => e.isDefault)[0] || "";
            this.couponActivity[e.storeId] = b && b.id;
            this.couponSubmit[e.storeId] = b && b.couponId;
            var c = e.paymentList.filter(e => e.isDefault)[0] || "";
            this.paymentType[e.storeId] = c && c.id;
            this.paytype=c.id;
            var d = e.expressList.filter(e => e.isDefault)[0] || "";
            this.expressType[e.storeId] = d && d.id;
            this.invoices[e.storeId] = e.defaultInvoice.invId || "";
            // this.messages[e.storeId] = "";

            // console.warn(e, '发票信息。。。在此判断是否加入整体的发票信息中。。。。');
            // if (!this.props.order.invoiceData[e.storeId]) {
            //     this.props.dispatch({ type:'order/invoicenEFF', obj:{ invId: e.defaultInvoice.invId, LzID: e.storeId, contentText: '商品明细', contentTitle: e.defaultInvoicetitleName || e.defaultInvoiceinvCompany || '暂无' }} )
            // }
        });
    }

    objArray = obj => {
        var list = [];
        Object.keys(obj).forEach(e => list.push({[e]: obj[e]}));
        return list;
    }

    inputOnChange = (e, id) => {
        // console.log(e.target.value, id, "触发inputOnChange。。。。。。。。。。。。。");
        this.messages[id] = e.target.value;
        this.setState({change: !this.state.change});
    }

    showActionSheet = (title, data, storeId) => {
        // const BUTTONS = ["满500减30", "满1000减100"];

        var BUTTONS = data.map(v => {
            let curActivity = '';
            switch (v.activityType) {
                case 10:
                    curActivity = '满减';
                    break;
                case 20:
                    curActivity = '满免邮';
                    break;
                case 30:
                    curActivity = '满送';
                    break;
            }
            console.warn(v.activityType, curActivity, 'BUTTONS shuju...............');

            if (v.isDefault && v.isEnabled) {
                return <div key={v.id} className={ item_select }>
                            <div style={{display: "inline-block", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", maxWidth:"90%", color: v.activityType != 90 ? '#000' : ''}}>
                                {
                                    curActivity && <span className={activityC}>{ curActivity }</span>
                                }
                                {v.name}
                            </div>
                            <span><Icon type='check-circle-o' style={{color: '#FF0036'}}/></span>
                       </div>
            } else if (v.isEnabled) {
                return <div key={v.id} className={ item_select }>
                            <div style={{color: '#000', display: "inline-block", overflow:"hidden", textOverflow:"ellipsis", whiteSpace:"nowrap", maxWidth:"90%"}}>
                                {
                                    curActivity && <span className={activityC}>{ curActivity }</span>
                                }
                                {v.name}
                            </div>
                            <span><Icon style={{width: '.55rem', height: '.55rem', transform: 'translateX(.09rem)'}} type={cricleSvg.id}/></span>
                       </div>
            } else {
                return <div key={v.id} className={ item }>
                            <div style={{display:"inline-block",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",maxWidth:"90%", color: '#e5e5e5'}}>
                                {
                                    curActivity && <span className={activityC}>{ curActivity }</span>
                                }
                                {v.name}
                            </div>
                        </div>

            }
        });
        // BUTTONS.push(<div style={{backgroundColor: 'red', color: '#fff'}}>关闭</div>)

        console.warn(BUTTONS, "BUTTONS");

        var titleP = () => {
            return (
                <p style={{width: '100%', position: 'relative'}}>
                    {title}
                    <span style={{position: 'absolute', top: '50%', right: '2rem', transform: 'translateY(-50%)'}}><Icon size='lg' type='cross' /></span>
                </p>
            );
        };


        this.setState({showData: data});

        ActionSheet.showActionSheetWithOptions({
            // cancelButtonIndex: BUTTONS.length - 1,
            // destructiveButtonIndex: BUTTONS.length - 2,
            options: BUTTONS,
            title: <p style={{width: '100%', position: 'relative'}}>
                {title}
                <span onClick={() => ActionSheet.close()} style={{position: 'absolute', top: '50%', right: '0', transform: 'translateY(-50%)'}}><Icon style={{color: '#666'}} size='md' type='cross' /></span>
            </p>,
            // message: 'I am description, description, description',
            maskClosable: true,
            'data-seed': 'logId',
            className: actioveClass,
            wrapProps,
        },
        (index, a) => {
            if (index == -1) return false;
            // if (index == (BUTTONS.length - 1)) return false;
            console.log(index, "点击的index");
            if (title == "店铺优惠") {
                console.warn(data, index, "数据");
                if (data[index].isEnabled) this.props.dispatch({ type:'order/updateOrderEFF', obj: {storeId: storeId, typeId: 1, ruleId: data[index].id} })
                else Toast.fail("您暂时不能选择此优惠");
            } else if (title == "优惠券") {
                console.warn(data, index, "数据");
                if (data[index].isEnabled) this.props.dispatch({ type:'order/updateOrderEFF', obj: {storeId: storeId, typeId: 2, ruleId: data[index].id} })
                else Toast.fail("您暂时不能选择此优惠");
            } else if (title == "付款方式") {
                this.props.dispatch({ type:'order/updateOrderEFF', obj: {storeId: storeId, typeId: 3, ruleId: data[index].id} })
            } else if (title == "配送方式") {
                this.props.dispatch({ type:'order/updateOrderEFF', obj: {storeId: storeId, typeId: 4, ruleId: data[index].id} })
            }
            this.setState({change: !this.state.change});
        });
    }
    handlePayModel = (vName, vValue) => {
        this.setState({
            [vName]:vValue
        })
    }


    render() {
        const { order, dispatch } = this.props;
        const { list, defaultAddress, addressEntities, invoice, totalPrice,kindlyeminder} = order;
        let { paytypeModel, paytype, isPd ,sendModel,sendtype,coutype,conModel,contype} = this.state;
        const { getFieldProps } = this.props.form;
        const switchAll = this.props.form.getFieldsValue();

        // console.log(this.props, "this");

        // if (!Object.keys(this.storeActivity).length && !Object.keys(this.storeActivity).length) this.init(list);
        this.init(list);
        // console.log(this.props, "asdfasdfasdf");

        return (
            <Flex
                style={{
                height:"100%",
                position:'relative',
               }}
                direction="column"

            >
                <NavTopBar dispatch={dispatch} title="填写订单" onEnter={true}></NavTopBar>
                {
                    order.coupons && order.coupons.ret.kindlyeminder && this.state.visible?
                        <NoticeBar
                            mode="link"
                            icon={<Icon type={notice.id} size="xxs" />}
                            style={{ width:'100%', backgroundColor:'#47B4F9', color:"#fff",height:'1rem'}}
                            marqueeProps={{ loop: true, style: { padding: '0 .075rem' } }}

                            action={
                                <Icon
                                    onClick={()=>{
                                        this.setState({
                                            visible:false
                                        })
                                    }}
                                    type="cross"
                                />
                            }

                        >
                            {order.coupons && order.coupons.ret.kindlyeminder}
                            {/* {couponMessage} */}
                        </NoticeBar> : ""
                }
                <MyScroll>
                    <div  className={order_all}>
                        {
                            defaultAddress.map((v,i,a)=>{

                                return (
                                    <Flex key={i} className="order_address"onClick={()=>{
                                        dispatch(routerRedux.push("/orderAddress"))
                                    }} >
                                        <Flex>
                                            <Icon type={orderAddress.id} />
                                        </Flex>
                                        <Flex.Item>
                                            <Flex className="address_preson">
                                                <div>收货人：</div>
                                                <Flex.Item>
                                                    <Flex justify="between"style={{paddingRight:'.3rem'}}>
                                                        <div>{ v.trueName }</div>
                                                        <div>{ v.mobPhone  }</div>
                                                    </Flex>

                                                </Flex.Item>
                                            </Flex>

                                            <Flex className="address_info">
                                                <div>收货地址：</div>
                                                <Flex.Item>
                                                    <div>{ `${v.areaInfo} ${v.address}` }</div>
                                                </Flex.Item>
                                            </Flex>
                                        </Flex.Item>
                                        {/*<Icon type="right"/>*/}
                                    </Flex>
                                )
                            })
                        }

                        {
                            defaultAddress.length==0 ?
                                <Flex
                                    onClick={()=>{
                                        dispatch(routerRedux.push("/orderAddress"))
                                    }}
                                    className="no_address">
                                    <div></div>
                                </Flex> :""
                        }


                        <div className="back_line"></div>



                        <div className={ merch_bill }>
                            {
                                list.map((v,i,a)=>{
                                    let switchChecked = false;
                                    // switchAll[v.storeId] = !!this.props.order.invoiceData[v.storeId];

                                    // console.log(v.isSupportInvoice, !!v.isSupportInvoice,"v.isSupportInvoice");
                                    let couponActivityRuleList = v.couponActivityRuleList;


                                    return (
                                        <div  key={i}style={{marginBottom:'.5rem'}}>
                                            <List key={i}  renderHeader={() =>{
                                                return (
                                                    <Flex >
                                                        {v.storeLogo!=undefined?<NoLazyImg src={v.storeLogo} style={{width:".5rem",height:".5rem",marginRight:".2rem",backgroun:"#fff"}}/>:""}
                                                        <div>{v.storeName}</div>
                                                    </Flex>
                                                )
                                            } }>
                                                {
                                                    v.list.map((vv,ii,aa)=>{

                                                        return (
                                                            <div key={`${i}_${ii}`}>
                                                            <Flex className="good" style={ ii==0 ? { marginTop:'0rem',fontSize:".3rem" } : {} } >
                                                                <div
                                                                    onClick={()=>{
                                                                        dispatch(routerRedux.push(`/goodsDetail/${vv.specId}`));
                                                                    }}
                                                                    className="good_img"
                                                                >
                                                                    <NoLazyImg src={vv.goodsImages} />
                                                                </div>
                                                                <Flex.Item>
                                                                    <Flex style={{ height:"1.7rem" }} direction="column" justify="between">
                                                                        <div
                                                                            onClick={()=>{
                                                                                dispatch(routerRedux.push(`/goodsDetail/${vv.specId}`));
                                                                            }}
                                                                            className="good_name text-two-eli"
                                                                        >
                                                                            { vv.goodsName }
                                                                        </div>
                                                                        <div
                                                                            className="good_info"
                                                                            dangerouslySetInnerHTML={{ __html: vv.specInfo }}
                                                                        />
                                                                        <Flex justify="between" className="good_price">
                                                                            <div>￥{vv.goodsPrice}</div>
                                                                            <div style={{ color:'#1d1d1d' }}>x{vv.goodsNum}</div>
                                                                        </Flex>
                                                                    </Flex>
                                                                </Flex.Item>
                                                            </Flex>
                                                                <div className={gift_list}>
                                                                    {
                                                                        vv.giftGoodsList.map((v,i,a)=>{

                                                                            return (
                                                                                <Flex className="gift_item" justify="between" key={i}>
                                                                                    <div className="text-overflow-hidden">
                                                                                        <span className="name">[赠品]</span>
                                                                                        {v.sourceName }
                                                                                    </div>
                                                                                    <div>x{v.couponSourceNum }</div>
                                                                                </Flex>
                                                                            )
                                                                        })
                                                                    }
                                                                </div>
                                                        </div>
                                                        )
                                                    })
                                                }

                                                <List className="handle_info">
                                                    {    v.hasStoreActivity ?
                                                        <Item
                                                            style={{height: '1.2rem'}}
                                                            onClick={()=> {
                                                                this.currentId = v.storeId;
                                                                this.showActionSheet("店铺优惠", v.shopActivityPromotionRuleList.filter(e => e.activityType != 90), v.storeId);
                                                            }}
                                                            arrow="horizontal"
                                                            extra={<span style={{fontSize: '.24rem'}}>{v.shopActivityPromotionRuleList.filter(e => e.isDefault == 1)[0] ? v.shopActivityPromotionRuleList.filter(e => e.isDefault == 1 && e.activityType != 90)[0].name : "暂无可用优惠"}</span>}
                                                        >
                                                            店铺优惠
                                                        </Item> : ""
                                                    }

                                                    {   v.hasCouponActivity ?
                                                        <Item
                                                            style={{height: '1.2rem'}}
                                                            onClick={() => {
                                                                this.currentId = v.storeId;
                                                                this.showActionSheet("优惠券", v.couponActivityRuleList, v.storeId);

                                                                // this.setState({showType: 2, showData: v.couponActivityRuleList});
                                                            }}
                                                            arrow="horizontal"
                                                            extra={<span style={{fontSize: '.24rem'}}>{v.couponActivityRuleList.filter(e => e.isDefault == 1)[0] ? v.couponActivityRuleList.filter(e => e.isDefault == 1 && e.activityType == 90)[0].name : "暂无可用优惠"}</span>}
                                                        >
                                                            优惠券
                                                        </Item> : ""
                                                    }

                                                    <Item
                                                        style={{height: '1.2rem'}}
                                                        onClick={()=> {
                                                            this.currentId = v.storeId;
                                                            this.showActionSheet("付款方式", v.paymentList, v.storeId);
                                                        }}
                                                        arrow="horizontal"
                                                        extra={<span style={{fontSize: '.24rem'}}>{v.paymentList.filter(e => e.isDefault == 1)[0] ? v.paymentList.filter(e => e.isDefault == 1)[0].name : ""}</span>}
                                                    >
                                                        付款方式
                                                    </Item>

                                                    <Item
                                                        style={{height: '1.2rem'}}
                                                        onClick={() => {
                                                            this.currentId = v.storeId;
                                                            this.showActionSheet("配送方式", v.expressList, v.storeId);
                                                        }}
                                                        arrow="horizontal"
                                                        extra={<span style={{fontSize: '.24rem'}}>{v.expressList.filter(e => e.isDefault == 1)[0] ? v.expressList.filter(e => e.isDefault == 1)[0].name : ""}</span>}
                                                    >
                                                        配送方式
                                                    </Item>
                                                    {
                                                        v.isSupportInvoice ?
                                                        <Item
                                                            // onClick={()=>{
                                                            //     dispatch(routerRedux.push("/OrderInvoice"))
                                                            // }}
                                                            // arrow="horizontal"
                                                            style={{height: '1.2rem'}}
                                                            extra={
                                                                 <Switch
                                                                      {...getFieldProps(`${v.storeId}`, {
                                                                        initialValue: !!this.props.order.invoiceData[v.storeId],
                                                                        valuePropName: 'checked',
                                                                      })}
                                                                      onClick={(checked) => {
                                                                          console.log(checked, 'checked.......................................');
                                                                          if (!this.props.order.invoiceData[v.storeId] && checked) {
                                                                              this.props.dispatch({ type:'order/invoicenEFF', obj:{ noGoBack: true, invId: v.defaultInvoice.invId, LzID: v.storeId, contentText: '商品明细', contentTitle: v.defaultInvoice.titleName || v.defaultInvoiceinv.company || '暂无' }} )
                                                                          }
                                                                      }}
                                                                 />
                                                            }
                                                        >
                                                            发票信息
                                                        </Item> :
                                                        <Item
                                                            // arrow="horizontal"
                                                            style={{height: '1.2rem'}}
                                                            extra={
                                                                <div>
                                                                    <p style={{margin: "0rem", color: "e5e5e5", fontSize: '.24rem'}}>该店不支持开发票业务</p>
                                                                </div>
                                                            }
                                                        >
                                                            发票信息
                                                        </Item>
                                                    }

                                                    {
                                                        v.isSupportInvoice && switchAll[v.storeId] ? <Item
                                                                                style={{height: '1.2rem'}}
                                                                                arrow="horizontal"
                                                                                extra={ this.props.order.invoiceTitle[v.storeId] }
                                                                                onClick={e => dispatch(routerRedux.push({pathname: `/OrderInvoice/${v.storeId}`, query: {invId: this.props.order.invoiceData[v.storeId]} }))}
                                                                            >
                                                                                {this.props.order.invoiceData[v.storeId] ? '发票抬头' : "您还未添加发票信息"}
                                                                            </Item> : ""
                                                    }
                                                    <Item
                                                        style={{height: '1.2rem'}}
                                                        // onClick={()=>{
                                                        //     dispatch(routerRedux.push("/orderPayType"))
                                                        // }}
                                                        // arrow="horizontal"
                                                    >
                                                        买家留言:{<input onChange={e => this.inputOnChange(e, v.storeId)} maxLength='50' value={this.messages[v.storeId] || ""} style={{marginLeft:'.3rem',width:'4.5rem',height:'.4rem',border:'none',fontSize:".24rem"}} type="text" placeholder='选填:填写内容和商家协商确认(50个字内)'/>}
                                                    </Item>
                                                    <Item
                                                        // onClick={()=>{
                                                        //     dispatch(routerRedux.push("/orderPayType"))
                                                        // }}
                                                        //arrow="horizontal"
                                                    >
                                                        <div style={{textAlign:"right"}}>
                                                            共{v.goodsNum}件商品:&nbsp;小计{<span style={{color:'red',paddingLeft:'.3rem'}}>￥<span style={{fontSize:'.4rem'}}>{`${v.goodsTotalPrice}`.slice(0, -2)}</span><span>{`${v.goodsTotalPrice}`.slice(-2)}</span></span>}
                                                        </div>

                                                    </Item>

                                                    {/*<Item*/}
                                                    {/*extra={<div><Switch checked={isPd == 1} onChange={this.onChangePd} platform="ios"/></div>}*/}
                                                    {/*>余额支付</Item>*/}

                                                    {/*<Item*/}
                                                    {/*//  extra={memberAvailable}*/}
                                                    {/*>&nbsp;</Item>*/}

                                                </List>
                                            </List>


                                        </div>
                                    )
                                })
                            }
                        </div>



                        {/*<Flex className="goods_list">*/}
                            {/*<Flex.Item style={{ marginLeft:"0.2rem" }}>*/}
                                {/*<CanChangeScrollX*/}
                                    {/*style={{ height:"1.62rem" }}*/}
                                    {/*wrapperId='CanChangeScrollOrderWraperId'*/}
                                    {/*targetId='CanChangeScrollOrderTargetId'*/}
                                {/*>*/}
                                    {/*{*/}
                                        {/*list.map((v,i,a)=>{*/}

                                            {/*let imgList = v.list.map((vv,ii,aa)=>{*/}

                                                {/*return (*/}
                                                    {/*<NoLazyImg style={ i==0&&ii==0 ? { marginLeft:"0rem" } : {}}  key={`${i}_${ii}`} src={vv.goodsImages} />*/}

                                                {/*)*/}
                                            {/*})*/}

                                            {/*return imgList*/}
                                        {/*})*/}
                                    {/*}*/}
                                {/*</CanChangeScrollX>*/}
                            {/*</Flex.Item>*/}
                            {/*<Flex*/}
                                {/*onClick={()=>{*/}
                                    {/*dispatch(routerRedux.push("/merchbill"))*/}
                                {/*}}*/}
                                {/*className="list_right"*/}
                            {/*>*/}
                           {/*<span>*/}
                               {/*共*/}
                               {/*{*/}
                                   {/*list.reduce((p,v,i,a)=>{*/}
                                       {/*return p+v.goodsNum*/}
                                   {/*},0)*/}
                               {/*}*/}
                               {/*件*/}
                           {/*</span>*/}
                                {/*<Icon type="right" />*/}
                            {/*</Flex>*/}
                        {/*</Flex>*/}



                        <div className="back_line"></div>

                        {/*<div className="order_price">*/}
                            {/*<Flex justify="between">*/}
                                {/*<div>商品总额</div>*/}
                                {/*<div>￥{0.00}</div>*/}
                            {/*</Flex>*/}
                            {/*<Flex justify="between">*/}
                                {/*<div>运费</div>*/}
                                {/*<div>￥{0.00}</div>*/}
                            {/*</Flex>*/}
                            {/*<Flex className="all_price" justify="between">*/}
                                {/*<div>合计：</div>*/}
                                {/*<div>￥{0.00}</div>*/}
                            {/*</Flex>*/}
                        {/*</div>*/}
                    </div>
                </MyScroll>

                <div id="allmap" style={{ height:"0rem", width:'0rem' }}></div>
                {/*<div  className={submit_btn} onClick={()=>{*/}

                {/*}}>提交订单</div>*/}
                {totalPrice!=""?<div className={ footBar }>
                    <div onClick={()=>{

                        var invoicesList = [];
                        var invoicesTextList = [];

                        Object.keys(order.invoiceData).forEach(e => switchAll[e] ? invoicesList.push({[e]: order.invoiceData[e]}) : "");
                        Object.keys(order.invoicesTextList).forEach(e => switchAll[e] ? invoicesTextList.push({[e]: order.invoicesTextList[e]}) : "");
                        console.warn("打印发票数据信息", this.invoices, switchAll, invoicesList);
                        var LzList = [];
                        Object.keys(this.expressType).forEach(v => LzList.push(`${this.expressType[v]}|${v}`));

                        if (!defaultAddress[0]) return Toast.info('请填写您的收货地址', 1.5);
                        this.props.dispatch({ type:'order/submitOrderEff', obj: {
                                // 收货地址
                                addressId: defaultAddress[0] && defaultAddress[0].id
                                // 配送方式
                                ,shopingName: JSON.stringify( this.objArray(this.expressType) )
                                // 支付方式
                                ,paytype: JSON.stringify( this.objArray(this.paymentType) )
                                // // 运费。。。
                                // ,freight: LzList.filter(v => v).join(",")
                                // 优惠券
                                ,couponId: Object.values(this.couponSubmit).filter(v => v).join(",")

                                // 发票信息
                                ,invoiceId: JSON.stringify( invoicesList )
                                // 发票内容
                                ,invoiceName: JSON.stringify( invoicesTextList )

                                    // 活动
                                    ,activityIds: Object.values(this.storeActivity).filter(v => v).join(",")
                                    // 买家留言
                                    ,orderMessage: JSON.stringify( this.objArray(this.messages) )
                                }}).then(res => {
                                    if (res.code == 200) {
                                        if (res.ret.payAmount != 0) this.props.dispatch(routerRedux.replace({pathname: `/payMent/${[res.ret.payAmount, res.ret.orderSn, res.ret.paySn]}`}))
                                        else this.props.dispatch(routerRedux.replace({pathname: `/paySuccess/${[res.ret.amount, res.ret.orderSn, res.ret.paySn, this.paytype]}`}))
                                    } else if (res.code == 400) {
                                        Toast.fail(res.msg, 1.5);
                                    }
                                })

                    }}>提交订单</div>

                    <div>
                        合计金额: <span className="fontRed">￥<span>{`${totalPrice}`.slice(0, -2)}</span>{`${totalPrice}`.slice(-2)}</span>
                    </div>

                    {
                        this.props.app.targetScrollHeight < -620 ? <span className={ span_address }>{ defaultAddress[0] ? `${defaultAddress[0].areaInfo} ${defaultAddress[0].address}` : "请填写收货地址" }</span> : ""
                    }



                </div>:""}


                <Modal
                    popup
                    key={1}
                    visible={this.state.showType == 1}
                    onClose={()=> this.setState({showType: 0}) }
                    animationType="slide-up"
                >
                    <div>
                        <List renderHeader={() => '店铺优惠'}>
                            {
                                this.state.showData.map(v => {
                                    return (
                                        <Item><Button type={this.storeActivity[this.currentId] == v.activityId ? "primary" : ""} onClick={() =>{
                                                this.storeActivity[this.currentId] = v.activityId;
                                                this.storeActivityText = v.name;
                                                this.setState({showType: 0});
                                            }}>{v.name}</Button></Item>
                                    )
                                })
                            }

                            {/* <Item><Button type='primary' onClick={() =>{ this.setState({ conModel:false, coutype:1 }) }}>满1000减100</Button></Item> */}
                            <Item><Button onClick={() => { this.setState({ conModel:false, coutype:0 }) }}>满500减3{this.state.showType}0</Button></Item>
                            <Item><Button type='ghost' onClick={()=> this.setState({showType: 0}) }>取消</Button></Item>
                        </List>
                    </div>
                </Modal>

                {/* {
                    this.state.showType == 2 && */}
                    <Modal
                        // key={`${this.state.showType}_${this.currentId}`}
                        key={2}
                        popup
                        closable
                        visible={this.state.showType == 2}
                        onClose={()=> this.setState({showType: 0}) }
                        animationType="slide-up"
                    >
                        <List style={{minHeight: '5rem'}} renderHeader={() => '优惠券'}>
                            {
                                this.state.showData.map(v => {
                                    let curActivity = '';
                                    switch (v.activityType) {
                                        case 10:
                                            curActivity = '满减';
                                            break;
                                        case 20:
                                            curActivity = '满免邮';
                                            break;
                                        case 30:
                                            curActivity = '满送';
                                            break;
                                    }
                                    console.warn(v.activityType, curActivity, 'BUTTONS shuju...............');

                                    if (v.isDefault && v.isEnabled) {
                                        return <Item key={v.id} className={ item_select }>
                                                    <div style={{display: "inline-block", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", maxWidth:"90%", color: v.activityType != 90 ? '#000' : ''}}>
                                                        {
                                                            curActivity && <span className={activityC}>{ curActivity }</span>
                                                        }
                                                        {v.name}
                                                    </div>
                                                    <span><Icon type='check-circle-o' style={{color: '#FF0036'}}/></span>
                                               </Item>
                                    } else if (v.isEnabled) {
                                        return <Item key={v.id} className={ item_select }>
                                                    <div style={{color: '#000', display: "inline-block", overflow:"hidden", textOverflow:"ellipsis", whiteSpace:"nowrap", maxWidth:"90%"}}>
                                                        {
                                                            curActivity && <span className={activityC}>{ curActivity }</span>
                                                        }
                                                        {v.name}
                                                    </div>
                                                    <span><Icon style={{width: '.55rem', height: '.55rem', transform: 'translateX(.09rem)'}} type={cricleSvg.id}/></span>
                                               </Item>
                                    } else {
                                        return <Item key={v.id} className={ item }>
                                                    <div style={{display:"inline-block",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",maxWidth:"90%", color: '#e5e5e5'}}>
                                                        {
                                                            curActivity && <span className={activityC}>{ curActivity }</span>
                                                        }
                                                        {v.name}
                                                    </div>
                                                </Item>

                                    }
                                })
                            }
                            {/* <Item><Button type='primary' onClick={() =>{ this.setState({ conModel:false, coutype:1 }) }}>满1000减100</Button></Item>
                            <Item><Button onClick={() => { this.setState({ conModel:false, coutype:0 }) }}>满500减30</Button></Item>
                            <Item><Button type='ghost' onClick={()=> this.setState({showType: 0}) }>取消</Button></Item> */}
                        </List>
                    </Modal>
                {/* } */}



                <Modal
                    // key={`${this.state.showType}_${this.currentId}`}
                    key={3}
                    popup
                    visible={this.state.showType == 3}
                    onClose={()=> this.setState({showType: 0}) }
                    animationType="slide-up"
                >
                    <div>
                        <List renderHeader={() => <span style={{fontSize: '.32rem'}}>优惠券</span>}>
                            {
                                this.state.showData.map(v => {

                                    return (
                                        <Item>为什么你不出来呢啊！！！</Item>
                                    )
                                })
                            }
                            <Item><Button type='primary' onClick={() =>{ this.setState({ conModel:false, coutype:1 }) }}>满1000减100</Button></Item>
                            <Item><Button onClick={() => { this.setState({ conModel:false, coutype:0 }) }}>满500减30</Button></Item>
                            <Item><Button type='ghost' onClick={()=> this.setState({showType: 0}) }>取消</Button></Item>
                        </List>
                    </div>
                </Modal>

                <Modal
                    popup
                    key={4}
                    visible={this.state.showType == 4}
                    onClose={()=> this.setState({showType: 0}) }
                    animationType="slide-up"
                >
                    <div>
                        <List renderHeader={() => '选择支付方式'}>
                            {/* {
                                this.state.showData.map(v => {

                                    return (
                                        <Item><Button type='primary' onClick={() =>{
                                                this.storeActivity[this.currentId] = v.id;
                                                this.storeActivityText = v.name;
                                                this.setState({showType: 0});
                                            }}>{v.name}</Button></Item>
                                    )
                                })
                            } */}
                            <Item><Button type='primary' onClick={() =>{ this.setState({ paytypeModel:false, paytype:1 }) }}>在线支付</Button></Item>
                            <Item></Item>

                            <Item><Button onClick={() => { this.setState({ paytypeModel:false, paytype:0 }) }}>货到付款</Button></Item>
                        {/* <Item><Button type='ghost' onClick={()=> this.setState({showType: 0}) }>取消</Button></Item> */}
                        </List>
                    </div>
                </Modal>

                <Modal
                    popup
                    key={5}
                    visible={this.state.showType == 5}
                    onClose={()=> this.setState({showType: 0}) }
                    animationType="slide-up"
                >
                    <div>
                        <List renderHeader={() => '选择配送方式'}>
                            {
                                this.state.showData.map(v => {

                                    return (
                                        <Item><Button type='primary' onClick={() =>{
                                                this.storeActivity[this.currentId] = v.id;
                                                this.storeActivityText = v.name;
                                                this.setState({showType: 0});
                                            }}>{v.name}</Button></Item>
                                    )
                                })
                            }
                            <Item><Button type='primary' onClick={() =>{ this.setState({ sendModel:false, sendtype:1 }) }}>顺丰包邮</Button></Item>
                            <Item><Button onClick={() => { this.setState({ sendModel:false, sendtype:0 }) }}>EMS</Button></Item>
                            <Item><Button type='ghost' onClick={()=> this.setState({showType: 0}) }>取消</Button></Item>
                        </List>
                    </div>
                </Modal>



                {/*<Modal*/}
                    {/*popup*/}
                    {/*visible={visible}*/}
                    {/*onClose={()=>{ this.handlePayModel(false) }}*/}
                    {/*animationType="slide-up"*/}
                {/*>*/}
                    {/*<div>*/}
                        {/*<List renderHeader={() => '选择支付方式'}>*/}
                            {/*<Item><Button type='primary' onClick={() =>{ this.setState({ visible:false, paytype:1 }) }}>在线支付</Button></Item>*/}
                            {/*<Item><Button onClick={() => { this.setState({ visible:false, paytype:0 }) }}>货到付款</Button></Item>*/}
                            {/*<Item><Button type='ghost' onClick={()=>{ this.handlePayModel(false) }}>取消</Button></Item>*/}
                        {/*</List>*/}
                    {/*</div>*/}
                {/*</Modal>*/}
            </Flex>
            )
    }
}

export default connect(({order, app})=>({order, app}))(createForm()(order));
